<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>提交订单</title>
		<!--网页标题显示网站logo，图片16*16放在根目录下-->
		<!--<link type="image/x-icon" href="./favicon.ico" rel="shortcut icon">-->
		<link rel="stylesheet" href="./Public/Home/bootstrap-3.3.5-dist/css/bootstrap.min.css" />
		<script type="text/javascript" src='./Public/Home/jquery.min.js'></script>
		<script type="text/javascript" src='./Public/Home/bootstrap-3.3.5-dist/js/bootstrap.min.js'></script>
		<link rel="stylesheet" href="./Public/Home/css/referOrder.css" />
		<link rel="stylesheet" href="./Public/Home/iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/ifont.css"/>
		<script type="text/javascript" src='./Public/Home/js/index.js'></script>
		<script type="text/javascript" src='./Public/Home/js/area.js'></script>
	</head>
	<body>
		
		<!--公共顶部-->
		<div class="tp _w100">
			<div class="top _certain">
				<ul class="top_l">
					<li><a href="">时尚商城</a></li>
					<li class="ip">
						<a href=""><i class="glyphicon glyphicon-phone"></i>手机优购<span class="caret"></span></a>
						<div class="wx">
									<div class="dv1 fl"></div>
									<a href=""><div class="dv2 fl"></div></a>
									<a href=""><div class="dv3 fl"></div></a>
									<div class="la fl">安装优购客户端</div>
						</div>
					</li>
				</ul>
				<ul class="top_r">					
					<li class="fz">
							<a class="link" href="">
							更多<span class="caret">	
							<ul class="hz" style="z-index: 100;" >
								<li><a href="">收藏优购</a></li>
								<li>&nbsp;&nbsp;<a href="">帮助</a></li>
							</ul>
						</a>
					</li>
					<li class="cil">
							<a class="link fy" href="" style="z-index: 100;">
							公告<span class="caret"></span>
							<ul class="hiy" style="z-index: 10;" >
								<li><a href="">新年翻新样 运动￥89起</a></li>
								<li><a href=""> 精美舒适低跟靴 ￥99起 </a></li>
								<li><a href=""> 首尔卫衣特卖场 70%OFF </a></li>
								<li><a href=""> 优购首尔站 停发货详情 </a></li>
								<li><a href=""> 提醒会员谨防诈骗电话 </a></li>
							</ul>
							</a>
						</li>
					<a class="link" href="">
						我的订单						
					</a>&nbsp;&nbsp;					
					<a class="link fx" href="<?php echo U('Center/index')?>">
							我的优购<span class="caret"></span>
							<div class="hid">&nbsp;&nbsp;我的收藏</div>
						</a>
					<a class="link" href="javascript:;">|</a>&nbsp;&nbsp;
					 <a class="link" href="">登录</a>
					 <a class="link" href="">注册  </a>&nbsp;	 					 																
				</ul>
				
			</div>
		</div>
		<div class="_w100">
			<div class="top_down _certain">
				<a href="">
					<div class="logo fl">
						
					</div>
				</a>
				<ul class="process fr">
					<li>我的购物车<span class="glyphicon glyphicon-menu-right"></span></li>
					<li>提交订单<span class="glyphicon glyphicon-menu-right"></span></li>
					<li>成功提交订单<span class="glyphicon glyphicon-menu-right"></span></li>
				</ul>
			</div>
			<!--公共顶部结束-->
			<!--填写收货地址-->
			
				<div class="_w100 ctr">
					<div class="client_ad _certain" >
						<div class="ad_hd _certain" >
							<h4>请选择您的收货地址</h4>
							<span class="hd1">
								<a href="">返回购物车</a>
							</span>
							<span class="hd2">
								<a href="">管理收货地址</a>
							</span>
						</div>
						<!--增加地址-->												
						<div class="detail_ad ad2" style="">
							<form action="<?php echo U('Successsub/newaddress')?>" method="post">
							<div class="one">
								<span>收货人姓名*</span>
								<input type="text" name="customer" id="" value="" />
								<span>
									（请使用真实姓名，不能全部是数字/英文/包
									含特殊符号（括号、井号等））
								</span>
							</div>
							<div class="two">
								<span>收货人地址*</span>
								<select name="province"  id="area1">
									
								</select>
								<select name="city" id="area2">
									
								</select>
								<select name="town" id="area3">
									
								</select>
								<span>邮政编码</span>
								<input type="text" name="poscodes" id="" />
							</div>
							<div class="three">
								<input type="text" name="details" id="" value="" style="width: 310px;"/>
								<span>填写详细地址，确保准确到达</span>
							</div>
							<div class="four">
								<span>收货人手机*</span>
								<input type="text" name="telephone" id="" value=""/>
							</div>
							<div class="five">
								<span>收货时间*&nbsp;&nbsp;&nbsp;</span>
								<select name="taketime">
									<option value="">请选择</option>
									<option value="不限时间">不限时间</option>
									<option value="周一至周五">周一至周五</option>
									<option value="周六周日">周六周日</option>
								</select>
								<input type="submit" value="确认提交"/ style="position: relative;">
							</div>
							
						</form>
						</div>						
						<!--增加地址结束-->
						<!--提交订单-->
						<form action="<?php echo U('Successsub/addresses')?>" method="post">
						<!--输入地址-->
						<div class="detail_ad ad1">
							<?php foreach ($address as $v){?>
							<?php if($v['statu']==1){?>
                
							<div class="xq fl def" style="position: relative;">
							<?php }else{?>
							<div class="xq fl" style="position: relative;">
							
               <?php }?>
								<p class="wds cus">(<span class="gk"><?php echo $v['customer']?></span>&nbsp;收)<?php echo $v['addresses']?></p>
								<p class="wds tel"><?php echo $v['telephone']?></p>
								<p class="wds tak"><?php echo $v['taketime']?></p>
								<!--改地址主键-->
								<input type="hidden" name="number" class="number" value="<?php echo $v['did']?>" />
								<!--不加密电话号码提交到订单表-->
								<input type="hidden" name="" class="phone" value="<?php echo $v['tel']?>"/>
								<span class="dlet"><a href="<?php echo U('Refer/edit',array('did'=>$v['did']))?>" class="">修改</a>|<a href="<?php echo U('Refer/del',array('did'=>$v['did']))?>" class="del">删除</a></span>
							</div>							
							<?php }?>
							<input type="hidden" name="customer" class="cust" value="<?php echo $defaddress['customer']?>"/>
							<input type="hidden" name="telephone" class="tele" value="<?php echo $defaddress['telephone']?>"/>
							<input type="hidden" name="taketime" class="take" value="<?php echo $defaddress['taketime']?>"/>
							<input type="hidden" name="address_did" class="numb" value="<?php echo $defaddress['did']?>"/>
							<div class="nd fr" style="line-height: 90px;height: 90px;width: 180px;position: relative;margin-right: 50px;text-align: center;font-size: 18px;">
								<i class="iconfont">&#xe622;</i>
								<span class="nw"></span>增加新地址
							</div>
						</div>												
						
						<script type="text/javascript">
						
							$(function(){
								//用户信息提交，点击增加新地址
								$('.nd').click(function(){
									$('.ad1').fadeOut();
									$('.ad2').fadeIn();
								})
								//将用户选择的地址赋值到相应的隐藏域
								$('.xq').click(function(){
									//获取信息
									var cust = $(this).find('.gk').html();
									var tel = $(this).find('.phone').val();
									var tak = $(this).find('.tak').html();
									var num = $(this).find('.number').val();
									//赋值给隐藏域
									$('.cust').val(cust);
									$('.tele').val(tel);
									$('.take').val(tak);
									$('.numb').val(num);
									
								})
							})
						</script>
				
					</div>
					
				</div>
				<script type="text/javascript">
				//鼠标移入显示修改删除
					$(function(){
						$('.xq').hover(function(){							
								$(this).find('.dlet').stop().fadeIn();								
							},function(){								
								$(this).find('.dlet').stop().fadeOut();
						})
					});
				//点击选中默认地址
					$(function(){
						$('.xq').click(function(){
							$(this).addClass('def').siblings().removeClass('def');
						})
					})
				//点击删除地址
					$('.del').click(function(){
						$(this).parents('.xq').remove();
					})
				//点击修改收货地址
					$('.xg').click(function(){
						
						
					})
				</script>
				<style type="text/css">
					.ad2{display:none ;}
					.ad3{display:none;}
					.ad2 div{position: absolute;left: 20px;}
					.xq{width: 180px;float: left;margin-right: 10px;height: 90px;
						border: 2px dashed darkorchid;padding-top: 10px;
						padding-bottom: 20px;cursor: pointer;}
					.wds{line-height: 16px;width: 160px;margin-left: 10px;color: #666666;margin-bottom: 0px;}
					.dlet{position: absolute;right: 10px;bottom: 8px;display: none;z-index: 200;}
					.nd:hover{border: 2px dashed darkorchid;cursor: pointer;}
					.def{background:#E1E1E8;}
				</style>
				<!--付款方式-->
				<div class="_w100">
				<div class="pay _certain">
					<div class="pay_hd1 _certain">
						<h4>请填写您的报关信息</h4>						
						<span class="hd2">
							<a href="">为什么要报关验证?</a>
						</span>
					</div>
					<div class="pay_hd2">
						<p>
							<span class="glyphicon glyphicon-alert"></span>
							根据海关要求，购买境外商品需提供收货人
							真实姓名及身份证号码，请如实填写。
						</p>						
						
					</div>
					<div class="card">
						<span>请输入身份证号:</span>&nbsp;&nbsp;&nbsp;
						<input type="text" name="cardcodes" id="" value=""/>
					</div>
					<div class="pay_hd1 _certain">
						<h4>请选择您的付款方式</h4>						
						<span class="hd2">
							<a href=""> 查看银行限额及付款帮助</a>
						</span>
					</div>
					<div class="choose pay_hd2">
						<p>
							<span class="">请选择</span>
							（在线支付免运费）
						</p>						
						
					</div>
				</div>
				<!--选择付款银行-->
				<div class="bank _certain">
					<div class="word">
						<h4>网银支付</h4>						
						<span class="hd2">
							支持国内几乎所有银行的储蓄卡及信用卡
							进行支付（需开通网上银行）
						</span>
					</div>
					<ul class="bank_lis jz">
						<li>
							<a href="">
								<img src="./Public/Home/images/bank-1.png" alt="" />
								<input type="radio" name="" id="" value="" />
							</a>
						</li>
						<li>
							<a href="">
								<img src="./Public/Home/images/bank-1.png" alt="" />
								<input type="radio" name="" id="" value="" />
							</a>
						</li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href="">
							<img src="./Public/Home/images/bank-2.png" alt="" /></a>
							<input type="radio" name="" id="" value="" />
						</li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href="">
							<img src="./Public/Home/images/bank-2.png" alt="" /></a>
							<input type="radio" name="" id="" value="" />
						</li>
						<li class="last">
							<a href="">更多网上银行&nbsp;>></a>
							
						</li>
					</ul>
				</div>
	
				<div class="bank _certain">
					<div class="word">
						<h4>支付平台</h4>						
						<span class="hd2">
							
						</span>
					</div>
					<ul class="bank_lis jz">
						<li>
							<a href="">
								<img src="./Public/Home/images/bank-1.png" alt="" />
								<input type="radio" name="" id="" value="" />
							</a>
						</li>
						<li>
							<a href="">
								<img src="./Public/Home/images/bank-1.png" alt="" />
								<input type="radio" name="" id="" value="" />
							</a>
						</li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href="">
							<img src="./Public/Home/images/bank-2.png" alt="" /></a>
							<input type="radio" name="" id="" value="" />
						</li>
						<li><a href=""><img src="" alt="" /></a></li>
						<li><a href="">
							<img src="./Public/Home/images/bank-2.png" alt="" /></a>
							<input type="radio" name="" id="" value="" />
						</li>
						<li class="last">
							<a href="">更多网上银行&nbsp;>></a>
							
						</li>
					</ul>
				</div>
				<!--货到付款-->
				<div class="cod word _certain">
					<div class="cf">
						<h4>
							<input type="radio" name="" id="" value="" />
							货到付款
						</h4>						
						<span class="hd2">
							 该商品所在的发货仓库不支持货
							 到付款，请选择其他的支付方式
						</span>
					</div>
					<!--确认订单信息-->	
					<div class="cf">
						<h4>
							确认订单信息
						</h4>						
						
					</div>
					<!--具体订单-->
					<div class="lis _certain">
						<ul class="tab">
							<li class="fir" style="display: none;"><input type="checkbox" name="" id="" />&nbsp;&nbsp;全选</li>
							<li class="big">商品名称</li>
							<li class="normal">颜色尺码</li>
							<li class="normal">单价</li>
							<li class="normal">数量</li>
							<li class="normal">小计</li>
							
						</ul>
						<?php foreach ($goods as $k=>$v){?>
						<ul class="menu tab">
							<li class="fir">
								
								<a href="" style="z-index: 300;">
									<img src="<?php echo $v['options']['listview']?>" alt="" style="width: 100%;height: 100%;"/>
								</a>
								
							</li>
							<li class="big">
								<p class="jz" style="margin-left: 35px;"><a href=""><?php echo $v['name']?></a></p>
							</li>
							<li class="normal">
								
								<p class="p1" style="margin-left: -20px;">颜色：<span><?php echo $v['options']['color']?></span></p>
								<p class="p2" style="margin-left: -20px;">尺码：<span><?php echo $v['options']['size']?></span></p>
								
							</li>
							<li class="normal">
								<p class="p1"><span class="pice"><?php echo $v['price']?></span></p>
								<p class="p2"><span style="background: red;color: white;padding-left: 5px;padding-right: 5px;">限时抢</span></p>
							</li>
							<li class="normal spe">
								<p class="p1 pp">
									<span class="decre sp" style="font-size: 28px;line-height: 18px;">-</span>									
									<input type="text" name="" value="<?php echo $v['num']?>" class="num sp"/>
									<span class="incre sp" style="font-size: 18px; line-height: 20px;">+</span>
									<input type="hidden" name="sid" class="sids" value="<?php echo $k?>"/>
								</p>
								
							</li>
							<li class="normal total" style="color: red;"><?php echo $v['total']?></li>
							
						</ul>
						<?php }?>
				
				
						
					
				</div>
				<div class="confirm _certain">
					<ul class="js">
						<li>
							<span class="bg">商品总金额:</span>
							&nbsp;&nbsp;&nbsp;&nbsp;￥<span class="totals"><?php echo $totals?></span>
						</li>
						<li>
							<span>运费</span>&nbsp;&nbsp;
							&nbsp;&nbsp;<span>15</span>
						</li>
						<li>
							<span class="gr">在线免运费</span>
							&nbsp;&nbsp;&nbsp;<span>-15</span>
						</li>
						<li>
							<span>可获得优购积分：99点</span>
							<span class="bg">应付金额</span>￥
							<span class="tl totals"><?php echo $totals?></span>
						</li>
					</ul>
					<a href="">
						<button type="submit" class="btn btn-warning btn-lg">确认，提交订单</button>
					</a>
				</div>
				<div class="bottom _certain">
					<p>
						Copyright © 2011-2014 Yougou Technology Co., Ltd. 					<a href=""><span>粤ICP备09070608号-4</span></a>
						 增值电信业务经营许可证：<a href=""><span>粤 B2-20090203 </span></a>
					</p>
				</div>
			</div>
		<!--订单列表结束-->
		
			
	</div>
	
		</div>
				
	</form>	
			

		
		<style type="text/css">									
									.sp{display: block;width:15px;height:15px;float: left;font-size: 16px;cursor: pointer;color: #606060;margin-right: 3px;}
									.num{text-indent: 5px;}
									.decre{margin-left: 28px;}									
								</style>
<script type="text/javascript">
		   //购买数量的减法
	        $(function(){
	        	$('.decre').click(function(){
	        		var input=$(this).siblings('.num');
	        		var num =input.val()*1;
					num--;
					if(num<0) return;
					input.val(num);
					//点击减号时获得商品单价和商品数量两者相乘计算总价
					var pice = $('.pice').html();
					var total = parseInt(pice*num);
					//找父级找兄弟赋值小计
					$(this).parents('.spe').siblings('.total').html(total);
					//改变所有货品的总价
					//先获得原来的总价
					var money = $(this).parents('.lis').siblings('.confirm').find('.totals').html();													
					//点击之后新的总价
					var newmoney = money-pice;
					//将新的总价格赋值回去
					$('.totals').html(newmoney);
					
					
					//异步修改
					//抓取sid
					var nData = $(this).siblings('.num').val();
					//抓取商品数量
					var hData = $(this).siblings('.sids').val();										
					//发送异步
					$.ajax({
						type:"post",
						url:edit_path,
						data:{sid:hData,num:nData},
						dataType:'json',
						success:function(phpData){
							
						}
					});
					
	        	});
	        	//购买数量的加法
				$('.incre').click(function(){
	        		var input=$(this).siblings('.num');
	        		var num =input.val()*1;
					num++;
					input.val(num);
					//点击时获得商品单价和商品数量两者相乘计算总价
					var pice = $('.pice').html();
					var total = parseInt(pice*num);
					//找父级找兄弟赋值总价
					$(this).parents('.spe').siblings('.total').html(total);
					//改变所有货品的总价
					//先获得原来的总价
					var money = $(this).parents('.lis').siblings('.confirm').find('.totals').html();													
					//点击之后新的总价
					var newmoney = parseInt(money)+parseInt(pice);
					//将新的总价格赋值回去
					$('.totals').html(newmoney);
					
					//异步修改
					//抓取sid
					var nData = $(this).siblings('.num').val();
					//抓取商品数量
					var hData = $(this).siblings('.sids').val();										
					//发送异步
					$.ajax({
						type:"post",
						url:edit_path,
						data:{sid:hData,num:nData},
						dataType:'json',
						success:function(phpData){
							
						}
					});
	        	});
	        })
	        //异步请求的地址
			var edit_path = "<?php echo U('Indent/edit')?>";
			//成功提交订单页的城市联动
			$(function(){
				//初始化方法
				area.init('area');
				//修改的时候默认被选中效果
				area.selected('黑龙江','哈尔滨','道里区');
			})
</script>
		
		
		
		
		
		
		
		
		
		
	</body>
</html>
